<template>
  <div>
    <el-dialog :title="!dataForm.id ? '附加费用新增' : '附加费用修改'" :close-on-click-modal="false" :visible.sync="visible" center>
      <el-button class="miui-dialog-close-btn" @click="visible = false">关闭页面</el-button>
      <el-form :model="dataForm" :rules="dataRule" ref="dataForm" label-width="120px">
        <el-form-item label="附加费用编码" prop="code">
          <el-input v-model="dataForm.code"></el-input>
        </el-form-item>
        <el-form-item label="附加费用名称" prop="name">
          <el-input v-model="dataForm.name"></el-input>
        </el-form-item>
        <el-form-item label="附加费用金额" prop="fee">
          <el-input v-model="dataForm.fee"></el-input>
        </el-form-item>
        <!-- <auto-complete :data="'mirror_ball_enum'" ref="autoComplete" @success="success"></auto-complete> -->
        <el-form-item label="所属制造商" prop="supplyId">
          <el-input v-model="dataForm.supplyName" placeholder="制造商" readonly>
            <el-button slot="append" @click="openSupplyDialog">选择</el-button>
          </el-input>
        </el-form-item>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button type="primary" @click="dataFormSubmit" :loading="ischeck" v-prevent-re-click>保 存</el-button>
      </span>
    </el-dialog>
    <search-supply v-if="supplyVisible" ref="supplyDialog" @refreshData="getSupplyData"></search-supply>
  </div>
</template>

<script>
  import { mapGetters } from 'vuex'
  import {
    getAddFeeObj,
    addAddFeeObj,
    putAddFeeObj
  } from '@/api/eims/add-fee'
  import { getSupplyObj } from '@/api/eims/supply'
  import { remote } from '@/api/admin/dict'

  import SearchSupply from '@/components/business/SearchSupply'

  export default {
    data() {
      return {
        visible: false,
        ischeck: false,
        supplyVisible: false,
        saveHandle: false,
        dataForm: {
          id: 0,
          name: '',
          code: '',
          fee: '',
          supplyId: '',
          supplyName: ''
        },
        dataRule: {
          name: [{
            required: true,
            message: '附加费用名称不能为空',
            trigger: 'blur'
          }],
          code: [{
            required: true,
            message: '编码不能为空',
            trigger: 'blur'
          }],
          fee: [{
            required: true,
            message: '附加金额不能为空',
            trigger: 'blur'
          }]
        }
      }
    },
    components: {
      SearchSupply
    },
    computed: {
      ...mapGetters(['bizData'])
    },
    methods: {
      init(id) {
        this.dataForm.id = id || 0
        this.visible = true
        this.$nextTick(() => {
          this.$refs['dataForm'].resetFields()
          if (this.dataForm.id) {
            getAddFeeObj(this.dataForm.id).then(response => {
              this.dataForm = response.data.data
              getSupplyObj(this.dataForm.supplyId).then(result => {
                this.$set(this.dataForm, 'supplyName', result.data.data.name)
              })
            })
          }
        })
      },
      // 表单提交
      dataFormSubmit() {
        this.ischeck = true
        if (!this.saveHandle) {
          this.$refs['dataForm'].validate((valid) => {
            if (valid) {
              this.saveHandle = true
              if (this.dataForm.id) {
                putAddFeeObj(this.dataForm).then(data => {
                  this.$message.success('修改成功')
                  this.visible = false
                  this.saveHandle = false
                  this.$emit('refreshDataList')
                  setTimeout(() => {
                    this.ischeck = false
                  })
                }).catch(() => {
                  this.ischeck = false
                })
              } else {
                addAddFeeObj(this.dataForm).then(data => {
                  this.$message.success('添加成功')
                  this.visible = false
                  this.saveHandle = false
                  this.$emit('refreshDataList')
                  setTimeout(() => {
                    this.ischeck = false
                  })
                }).catch(() => {
                  this.ischeck = false
                })
              }
            }else{
              this.ischeck = false
            }
          })
        }
      },
      // 打开选择供应商弹框
      openSupplyDialog() {
        this.supplyVisible = true
        this.$nextTick(() => {
          this.$refs.supplyDialog.init({
            ctgId: ''
          })
        })
      },
      getSupplyData(data) {
        this.$set(this.dataForm, 'supplyId', data.id)
        this.$set(this.dataForm, 'supplyName', data.name)
      },

    }
  }
</script>
